<template>
  <div id="purchaseReview">
    <!--条件查询-->
    <el-form :inline="true" :model="searchPurchase" ref="SupplierList" class="demo-form-inline">
      <el-form-item label="供应商公司名称">
        <el-input v-model="searchPurchase.companyName" placeholder="请输入名称"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="queryPurchaseReview">查询</el-button>
      </el-form-item>
    </el-form>

    <!--数据表格-->
    <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
    >
      <el-table-column
          prop="purchaseOrder.purchaseOrderNumber"
          label="采购单编号">
      </el-table-column>
      <el-table-column
          prop="purchaseOrder.totalAmount"
          label="总数量">
      </el-table-column>
      <el-table-column
          prop="purchaseOrder.totalPrice"
          label="总金额">
      </el-table-column>
      <el-table-column
          label="供应商公司名称(联系电话)">
        <template slot-scope="scope">
          <span>{{ scope.row.companyName +"--"+ scope.row.phone }}</span>
        </template>
      </el-table-column>
      <el-table-column
          prop="purchaseOrder.register"
          label="登记人">
      </el-table-column>

      <el-table-column
          label="操作">
        <template slot-scope="scope">
          <el-button
              @click="purchaseReview(scope.row.purchaseOrder.purchaseId)"
              type="text"
              size="small"
              icon="el-icon-sold-out">
            复核
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页组件-->
    <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="pageSizeList"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
    </el-pagination>
  </div>
</template>

<script>
export default {
  name: "PurchaseReview",
  data() {
    return {
      searchPurchase: {},
      // 当前页号
      currentPage: 1,
      // 当前页大小
      pageSize: 5,
      // 总记录数
      total: 10,
      // 页大小列表
      pageSizeList: [2, 5, 10, 20],
      // 返回数据对象
      tableData: [],
    }
  },
  methods: {
    //复核
    purchaseReview(purchaseId) {
      this.$router.push({ path: '/purchaseCheckTag', query: { id: purchaseId } })
    },
    //采购单查询
    async queryPurchaseReview() {
      const { data: res } = await this.$http.post(`/purchaseOrder/queryPurchaseReview/${this.currentPage}/${this.pageSize}`,this.searchPurchase);
      this.tableData = res.rows;
      this.total = res.total;
    },
    //当前页改变
    handleCurrentChange(val){
      this.currentPage = val
      this.queryPurchaseReview()
    },
    //页大小改变
    handleSizeChange(val) {
      this.pageSize = val
      this.queryPurchaseReview()
    },
  },
  created() {
    this.queryPurchaseReview();
  }
}
</script>

<style scoped>

</style>